<template>
  <!--用户管理-->
  <div class='search'>
    <a-drawer :visible='modalVisible' :title='modalTitle' width='88%' @close='handleClose'>
      <a-tabs @tabClick='handleTabClick' :defaultActiveKey='current' v-model='current'>
        <a-tab-pane tab='用户信息' key='form1'>
          <user-form ref='form1' v-if='modalVisible'></user-form>
        </a-tab-pane>
        <a-tab-pane tab='分配角色' key='form2' v-if='isEdit'>
          <user-role ref='form2' v-if='modalVisible' @handleClose='handleClose'></user-role>
        </a-tab-pane>
        <a-tab-pane tab='分配账套' key='form3' v-if='isEdit'>
          <user-company ref='form3' v-if='modalVisible' @handleClose='handleClose'></user-company>
        </a-tab-pane>
        <a-tab-pane tab='分配部门' key='form6' v-if='isEdit'>
          <user-dept ref='form6' v-if='modalVisible' @handleClose='handleClose'></user-dept>
        </a-tab-pane>
        <a-tab-pane tab='分配权限' key='form4' v-if='isEdit'>
          <user-auth ref='form4' v-if='modalVisible' @handleClose='handleClose'></user-auth>
        </a-tab-pane>
        <a-tab-pane tab='字段管控' key='form5' v-if='isEdit'>
          <user-field ref='form5' v-if='modalVisible' @handleClose='handleClose'></user-field>
        </a-tab-pane>
        <a-tab-pane tab='商品管控' key='form7' v-if='isEdit'>
          <user-data-scope ref='form7' v-if='modalVisible' @handleClose='handleClose'></user-data-scope>
        </a-tab-pane>
        <a-tab-pane tab='仓库管控' key='form8' v-if='isEdit'>
          <user-data-scope-store ref='form8' v-if='modalVisible' @handleClose='handleClose'></user-data-scope-store>
        </a-tab-pane>
        <a-tab-pane tab='商品类型管控' key='form9' v-if='isEdit'>
          <user-data-scope-drug-type ref='form9' v-if='modalVisible' @handleClose='handleClose'></user-data-scope-drug-type>
        </a-tab-pane>
      </a-tabs>
      <div class='drawer-footer'>
        <a-button type='default' @click='handleClose'>取消</a-button>&nbsp;
        <a-button type='primary' @click='handleSubmit' :loading='saving'>保存</a-button>
      </div>
    </a-drawer>
  </div>
</template>
<script>

import UserForm from "./user_form"
import UserRole from "./user_role"
import UserAuth from "./user_auth"
import UserCompany from "./user_company"
import UserDept from "./user_dept"
import UserField from "./user_field"
import UserDataScope from "./user_datascope"
import UserDataScopeStore from "./user_datascope_store"
import UserDataScopeDrugType from "@/views/module/system/user/user_datascope_drug_type"

export default {
  name: "userModal",
  props: {},
  data() {
    return {
      saving: false,
      modalVisible: false,
      isEdit: false,
      title: "",
      current: "form1",
      userName: "",
      formData: {},
      forms: [
        "form1",
        "form2",
        "form3",
        "form4",
        "form5",
        "form6",
        "form10"
      ]
    }
  },
  methods: {
    handleShow(data) {
      this.isEdit = false
      this.userName = ""
      if (data && data.userId) {
        this.isEdit = true
        this.userName = data.userName
        this.formData = data
      } else {
        this.formData = {}
      }
      this.modalVisible = true
      this.handleTabClick("form1")
    },
    handleClose() {
      //this.$refs[this.current].handleReset()
      this.modalVisible = false
    },
    handleSubmit() {
      this.$refs[this.current].handleSubmit(this.handleClose)
    },
    handleTabClick(name) {
      this.current = name
      if (this.current === this.forms[0]) {
        this.title = this.isEdit ? "编辑用户" : "添加用户"
      }
      if (this.current === this.forms[1]) {
        this.title = "分配角色"
      }
      if (this.current === this.forms[2]) {
        this.title = "分配账套"
      }
      if (this.current === this.forms[3]) {
        this.title = "分配权限"
      }
      if (this.current === this.forms[4]) {
        this.title = "字段过滤"
      }
      if (this.current === this.forms[5]) {
        this.title = "商品管控"
      }
      if (this.current === this.forms[6]) {
        this.title = "仓库管控"
      }
      this.$nextTick(() => {
        this.$refs[this.current].setData(this.formData)
      })
    }
  },
  computed: {
    modalTitle: function() {
      return this.title+"-" + this.userName
    }
  },
  created() {
  },

  components: { UserDataScopeDrugType, UserDataScopeStore, UserDataScope, UserAuth, UserRole, UserForm, UserCompany, UserDept, UserField }
}
</script>

<style scoped lang='less' rel='stylesheet/less'>

</style>
